<!DOCTYPE html>
<title>Test showPicker() user gesture requirement</title>
<meta name="timeout" content="long">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-vendor.js"></script>

<select>
    <option>option</option>
</select>

<script type=module>
    const select = document.querySelector('select');

    test(() => {
        assert_throws_dom('NotAllowedError', () => { select.showPicker(); });
    }, `select showPicker() requires a user gesture`);

    promise_test(async t => {
        await test_driver.bless('show picker');
        select.showPicker();
        select.blur();

        assert_false(navigator.userActivation.isActive,
            'User activation should be consumed after calling showPicker().');

        assert_throws_dom('NotAllowedError', () => select.showPicker(),
            'select.showPicker() should throw when there is no user activation.');
    }, `select showPicker() does not throw when user activation is active.`);
</script>
